<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Flask JQuery</title>
<!-- 插入jquery -->
<script src="/static/js/jquery.js "></script>
<script type=text/javascript>
var $SCRIPT_ROOT = {{request.script_root|tojson|safe}};
</script>
<script type=text/javascript>
$(function() {
    function submit_form(e) {
        $.getJSON($SCRIPT_ROOT + '/add', {
            a: $('input[name="a"]').val(),
            b: $('input[name="b"]').val(),
            now: new Date().getTime()
        },
        function(data) {
            $('#result').text(data.result);
        });
    };
    // 绑定click事件
    $('#calculate').bind('click', submit_form);
});
</script>
</head>
<body>
<p>
    <input type=text size=5 name=a> +
    <input type=text size=5 name=b> =
    <span id=result>?</span>
</p>
<p><input type="button" id="calculate" value="compute"></p>
</body>
</html> 